import React ,{ Component, PropTypes }from 'react';
import { Router, Route,IndexRoute,browserHistory,hashHistory,IndexRedirect} from 'react-router';
import {connect} from 'react-redux';
import { Layout } from 'antd';
const { Content, Footer } = Layout;
import {Tool} from '../Tool';
import Util from '../utils/Util';
import SiderCustom from '../components/SiderCustom';
import HeaderCustom from '../components/HeaderCustom';
import Login from '../components/Login';
import Index from  '../components/Index';


/* 专家 */
import ExpertList from '../components/expert/ExpertList';
import ExpertForm from '../components/expert/ExpertForm';

/* demo */
import BasicForm from '../components/forms/BasicForm';
import BasicTable from '../components/tables/BasicTables';
import AdvancedTable from '../components/tables/AdvancedTables';
import AsynchronousTable from '../components/tables/AsynchronousTable';
import Echarts from '../components/charts/Echarts';
import Recharts from '../components/charts/Recharts';
import Icons from '../components/ui/Icons';
import Buttons from '../components/ui/Buttons';
import Spins from '../components/ui/Spins';
import Modals from '../components/ui/Modals';
import Notifications from '../components/ui/Notifications';
import Tabs from '../components/ui/Tabs';
import Banners from '../components/ui/banners';
import Drags from '../components/ui/Draggable';
import Dashboard from '../components/dashboard/Dashboard';
import Gallery from '../components/ui/Gallery';
import NotFound from '../components/pages/NotFound';
import BasicAnimations from '../components/animation/BasicAnimations';
import ExampleAnimations from '../components/animation/ExampleAnimations';

const Wysiwyg = (location, cb) => {     // 按需加载富文本配置
    require.ensure([], require => {
        cb(null, require('../components/ui/Wysiwyg').default);
    }, 'Wysiwyg');
};
/*
 * 配置路由
 * (路由根目录组件，显示当前符合条件的组件)
 *
 * @class Roots
 * @extends {Component}
 */
class Roots extends Component {
    componentDidMount(){
    }
    componentWillReceiveProps() {
        //必须登录状态
        //Util.ComUserLogin();
    }
    constructor(props) {
        super(props);
        this.state = {
            collapsed: false,
        };
        this.toggle=()=> {
            this.setState({
                collapsed: !this.state.collapsed,
            });
        };
    }
    render() {
        return (
            <div style={{height: '100%'}}>
              <Layout className="ant-layout-has-sider">
                  <SiderCustom path={this.props.location.pathname} collapsed={this.state.collapsed} />
                  <Layout>
                      <HeaderCustom toggle={this.toggle} />
                      <Content style={{ margin: '0 16px', overflow: 'initial' }}>
                          {this.props.children}
                      </Content>
                      <Footer style={{ textAlign: 'center' }}>
                          后台管理系统 ©2017 科学家在线
                      </Footer>
                  </Layout>
              </Layout>
            </div>
        );
    }
}

var NewRoots = connect(state=>({

}))(Roots);

var history = process.env.NODE_ENV !== 'production' ? browserHistory : hashHistory;
const RouteMap = (
    <Router history={hashHistory}>
        <Route path={'/'} component={NewRoots}>
            <IndexRoute component={Index}/>
            <Route path={'form'}>
                <Route path={'basicForm'} component={BasicForm} />
            </Route>
            <Route path={'table'}>
                <Route path={'basicTable'} component={BasicTable} />
                <Route path={'advancedTable'} components={AdvancedTable} />
                <Route path={'asynchronousTable'} components={AsynchronousTable} />
            </Route>
            <Route path={'chart'}>
                <Route path={'echarts'} component={Echarts} />
                <Route path={'recharts'} component={Recharts} />
            </Route>
            <Route path={'ui'}>
                <Route path={'icons'} component={Icons} />
                <Route path={'buttons'} component={Buttons} />
                <Route path={'spins'} component={Spins} />
                <Route path={'modals'} component={Modals} />
                <Route path={'notifications'} component={Notifications} />
                <Route path={'tabs'} component={Tabs} />
                <Route path={'banners'} component={Banners} />
                <Route path={'wysiwyg'} getComponent={Wysiwyg} />
                <Route path={'drags'} component={Drags} />
                <Route path={'gallery'} component={Gallery} />
            </Route>
            <Route path={'animation'}>
                <Route path={'basicAnimations'} component={BasicAnimations} />
                <Route path={'exampleAnimations'} component={ExampleAnimations} />
            </Route>
            <Route path={'expert'}>
                <Route path={'list'} component={ExpertList} />
                <Route path={'form'} component={ExpertForm} />
            </Route>
        </Route>
        <Route path={'login'} components={Login} />
        <Route path={'404'} component={NotFound} />
    </Router>
);
export default RouteMap;
